{% extends "base.html" %}

{% block title %}
    添加部门
{% endblock %}


{% block content %}
    <div>
        <div class="btn-group">
            {% url "addroleurl" as theaddroleurl %}
            <a class="btn btn-default {% if request.path == theaddroleurl %} active {% endif %}"
               href={{ theaddroleurl }}><span class="glyphicon glyphicon-edit"></span>新建部门</a>
            {% url "listroleurl" as thelistroleurl %}
            <a class="btn btn-default {% if request.path == thelistroleurl %} active {% endif %}"
               href={{ thelistroleurl }}><span class="glyphicon glyphicon-list"></span>部门列表</a>
        </div>
    </div>

    <hr/>

    <form class="form-horizontal" role="form" action={% url "addroleurl" %} method="POST">
        {% csrf_token %}

        {% for item in form %}
            <div class="form-group">
                <label class="control-label col-md-1">{{ item.label }}</label>
                {% if item.label == "权限" %}
                    <div class="col-md-11">{{ item }}</div>
                {% else %}
                    <div class="col-md-2">{{ item }}</div>
                {% endif %}
                <div class="col-md-offset-1 col-md-10">
                    {{ item.errors }}
                </div>
            </div>
        {% endfor %}

        <div class="form-group">
            <div class="col-md-offset-1 col-md-10">
                <button type="submit" class="btn btn-success btn-sm">新 建</button>
            </div>
        </div>

    </form>

    <script>
        var demo1 = $('select[name="permission"]').bootstrapDualListbox({
            nonSelectedListLabel: '可选择权限',
            selectedListLabel: '已选择权限',
            preserveSelectionOnMove: 'moved',
            moveOnSelect: false
        });
    </script>

{% endblock %}
